<template>
  <view class="caipiao">
    <view class="top">
      <view
        class="box"
        v-for="(item, index) in cptypelist"
        :key="index"
        @click="tiao(item.lottery_id)"
      >
       <image :src="`../../static/images/${item.lottery_id}.png`" mode=""></image>
        <span>
          {{ item.lottery_name }} <br />
          {{ item.remarks }}</span
        >
        <span>></span>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      cptypelist: [],
    };
  },
  created() {
    this.getcptylist();
    // this.get()
  },
  methods: {
    async getcptylist() {
      let res = await uni.request({
        url: "http://api.aslegou.top/api/cptypelist",
        method: "GET",
        data: {},
        success: (res) => {
          this.cptypelist = res.data.list;
          console.log(this.cptypelist);
        },
      });
      //   console.log("res", res);
    },
    tiao(id) {
      uni.navigateTo({
        url: "/pages/detail/detail?id="+id,
      });
    },
  },
};
</script>

<style lang="less" scoped>
.caipiao {
  width: 100vw;
  height: 100%;
  display: flex;
  flex-direction: column;
  //   align-items: center;
  background-color: #ff707d;
  .box {
    width: 85%;
    height: 100px;
    background-color: white;
    border-radius: 10px;
    margin-top: 5px;
    margin-left: 25px;
    display: flex;
    justify-content: space-around;
    align-items: center;
    image {
      width: 50px;
      height: 50px;
    }
  }
}
</style>
